<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

		<title>JSP Page</title>
		<link rel="stylesheet" type="text/css" href="css/paging.css" />

		<style>
			* {
				margin: 0;
				padding: 0;
			}
			
			html,
			body {
				height: 100%;
			}
			
			ul,
			li {
				list-style: none;
			}
			
			img {
				border: 0 none;
			}
			
			a:focus {
				color: #3c89fe;
			}
			
			.manage_header {
				width: 100%;
				height: 50px;
				font-family: "微软雅黑";
				font-size: 14px;
				line-height: 4;
			}
			
			.manage_header div:first-child {
				margin-left: 20px;
				float: left;
				margin-right: 15px;
				height: 50px;
			}
			
			.manage_header img {
				margin-top: 23px;
				float: left;
				margin-right: 10px;
			}
			
			.manage_header a:last-child {
				float: left;
				cursor: pointer;
				color: #3c89fe;
				text-decoration: none;
				height: 50px;
			}
			
			.journalInstruct {
				width: 96%;
				height: 80%;
				margin: auto;
			}
			
			.journalInstruct_header {
				width: 100%;
				height: 90px;
			}
			
			.date_picker {
				padding-right: 0;
				width: 176px;
				background: #fefefe;
				border: 1px solid #DEE4EC;
				font-size: 14px;
				color: #333;
				border-radius: 5px;
				text-align: center;
				height: 25px;
				cursor: pointer;
				outline: none;
			}
			
			.date_picker {
				width: 176px;
				background: #fefefe;
				border: 1px solid #DEE4EC;
				font-size: 14px;
				color: #333;
				border-radius: 5px;
				height: 25px;
				cursor: pointer;
				outline: none;
			}
			
			.header_div {
				display: inline-block;
				width: 295px;
				text-align: right;
			}
			
			.journalInstruct_header_a,
			.journalInstruct_header_b {
				height: 30px;
				padding-top: 10px;
				padding-bottom: 5px;
				min-width: 850px;
			}
			
			.journalInstruct_manipulate {
				width: 280px;
				height: 30px;
				border-radius: 10px;
				text-align: center;
				line-height: 1.8;
				background: #ebeef0;
				border: 1px solid rgb(153, 153, 153);
			}
			
			.journalInstruct_manipulate div {
				display: inline-block;
				width: 78px;
				height: 30px;
				cursor: pointer;
			}
			
			.journalInstruct_manipulate div:first-child,
			.journalInstruct_manipulate div:nth-of-type(2) {
				border-right: 1px solid rgb(153, 153, 153);
			}
			
			.manage_content_header {
				width: 100%;
				height: 40px;
				margin-top: 5px;
				background: #458bff;
				min-width: 1530px;
			}
			
			#pageTool {
				min-width: 1530px;
			}
			
			.content_input_a {
				width: 24px;
				height: 24px;
				margin-top: 8px;
				border: 1px solid black!important;
				/*background: #458bff!important;*/
				background-color: #458bff;
				border-radius: 5px;
				cursor: pointer;
				margin-left: 18px;
				margin-right: 30px;
			}
			
			.content_input_b {
				width: 24px;
				height: 24px;
				margin-top: 8px;
				border: 1px solid black!important;
				/*background: #458bff!important;*/
				background-color: white;
				border-radius: 5px;
				cursor: pointer;
				margin-left: 2px;
				margin-right: 30px;
			}
			
			.manage_content_header div,
			.manage_content_content div {
				float: left;
			}
			
			.tick {
				/*color: white;*/
				font-size: 27px;
				font-family: '微软雅黑';
				margin-top: -5px;
				margin-left: 2px;
				display: none;
				pointer-events: none;
			}
			
			.tick_block {
				/*color: white;*/
				font-size: 27px;
				font-family: '微软雅黑';
				margin-top: -5px;
				margin-left: 2px;
				display: block;
				pointer-events: none;
			}
			
			.manage_content_header_div {
				width: 160px;
				padding-top: 10px;
				height: 20px;
				text-align: left;
			}
			
			.manage_content_content {
				margin-left: 15px;
				width: 100%;
				height: 40px;
				border-bottom: 1px solid #e1e2e5;
				background: #fafafa;
			}
		</style>
	</head>

	<body>
		<div class="manage_header">
			<div>日志管理 </div>
			<img src="img/than.png" alt="" />
			<a href="journalInstruct.jsp">广告管理</a>
		</div>
		<div class="journalInstruct">
			<div class="journalInstruct_header">
				<div class="journalInstruct_header_a">
					<div class="header_div">
						<span>广告发布日期:</span>

						<input placeholder="请输入日期" class="laydate-icon date_picker" onClick="laydate({istime: true, format: 'YYYY-MM-DD-hh:mm'})">
					</div>
					<div class="header_div">
						<span>至:</span>

						<input placeholder="请输入日期" class="laydate-icon date_picker" onClick="laydate({istime: true, format: 'YYYY-MM-DD-hh:mm'})">
					</div>
					<div class="header_div">
						<span>标题:</span>
						<input placeholder="" class=" date_picker">
					</div>
					<div class="header_div">
						<span>广告发布状态:</span>
						<select name="" class="date_picker">
							<option value="0">请选择</option>
							<option value="1">已发布</option>
							<option value="2">未发布</option>
						</select>
					</div>

				</div>
				<div class="journalInstruct_header_b">
					<div class="header_div">
						<span>所属机构:</span>
						<select name="" class="date_picker">
							<option value="0">请选择</option>
							<option value="1">新指令</option>
							<option value="2">已下发</option>
							<option value="3">已完成</option>
						</select>
					</div>
					<div class="header_div">
						<span>设备组:</span>
						<select name="" class="date_picker">
							<option value="0">请选择</option>
							<option value="1">新指令</option>
							<option value="2">已下发</option>
							<option value="3">已完成</option>
						</select>
					</div>
					<div class="header_div">
						<span>设备类型:</span>
						<select name="" class="date_picker">
							<option value="0">请选择</option>
							<option value="1">新指令</option>
							<option value="2">已下发</option>
							<option value="3">已完成</option>
						</select>
					</div>

				</div>

			</div>
			<div class="journalInstruct_manipulate">
				<div onclick="backDeviceGroup()">增加</div>
				<div onclick="editorDeviceGroup()">编辑</div>
				<div onclick="deleteGroup()">删除</div>

			</div>
			<div class="manage_content_header">
				<div onclick="checkInput()" class="content_input_a">
					<div class=" tick  ">√</div>

				</div>

				<div class="manage_content_header_div">广告编号</div>
				<div class="manage_content_header_div">标题</div>
				<div class="manage_content_header_div">图片</div>
				<div class="manage_content_header_div">状态</div>
				<!--<div class="manage_content_header_div">顺序号</div>-->
				<div class="manage_content_header_div">发布人</div>
				<div class="manage_content_header_div">发布时间</div>
				<div class="manage_content_header_div">最后修改人</div>
		

			</div>
			<div id="pageTool">
				<div ondblclick="ondblInput()" class="manage_content_content">
					<div onclick="checkInputA(this)" class="content_input_b" id="0">
						<div id="tick_0" class="tick">√</div>
					</div>
					<div class="manage_content_header_div">admin</div>
					<div class="manage_content_header_div">深圳优博讯</div>
					<div class="manage_content_header_div">超级管理员</div>
					<div class="manage_content_header_div">13456@qq.com</div>
					<div class="manage_content_header_div">13422266666</div>
					<div class="manage_content_header_div">管理员</div>
					<div class="manage_content_header_div">2017-07-06 00:00:00</div>


				</div>
			</div>
		</div>

		<script src="js/jq.js" type="text/javascript" charset="utf-8"></script>

		<script src="js/jQuery.Cookie.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/laydate.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			//			日期
			! function() {
				laydate.skin('danlan'); //切换皮肤，请查看skins下面皮肤库
				laydate({
					elem: '#demo'
				}); //绑定元素
			}();
			//			全体打钩
			function checkInput() {
				var tick = $(".tick").css("display");
				console.log(tick)
				if(tick == "none") {
					$(".tick").show();
					console.log("?")
				} else if(tick == "block") {
					$(".tick").hide();
					$(".tick").hide();
					$(".tick_block ").hide();
					console.log("6")
				}
			}
			//			单独打钩
			function checkInputA(data) {
				console.log(data.id)
				var ticka = "tick_" + data.id
				var tickBlock = document.getElementById(ticka);
				if(tickBlock.style.display == "block") {
					tickBlock.style.display = "none";
				} else if(tickBlock.style.display == "" || tickBlock.style.display == "none") {
					tickBlock.style.display = "block";
				}
			}
			
			function backDeviceGroup(){
				window.location.href = 'journalInstructAdd.jsp';
				
			}
		</script>
	</body>

</html>